<template>
  <div style="min-width: 300px;width: 100%;">
    <el-form v-if="device.value.stateJson" inline>
      <el-form-item :label="$t('device.Voltage')">
        {{device.value.stateJson.air1.Voltage}}V
      </el-form-item>
      <el-form-item :label="$t('device.Current')">
        {{device.value.stateJson.air1.Current}}A
      </el-form-item>
      <el-form-item :label="$t('device.State')">
        {{device.value.stateJson.air1.state > 0 ? $t('device.SwitchOn') : $t('device.SwitchOff')}}
      </el-form-item>
    </el-form>
    <div>
      <el-button :type="buttonType" :disabled="!device.online" v-on:click="handleClick('ON')">
        <i style="color:#ffffff" class="el-icon-off"></i>{{$t('device.SwitchOn')}}
      </el-button>
      <el-button :type="buttonType" :disabled="!device.online" v-on:click="handleClick('OFF')">
        <i style="color:#ffffff" class="el-icon-off"></i>{{$t('device.SwitchOff')}}
      </el-button>
    </div>
  </div>
</template>
<script>
  export default {
    name: 'AirSwitch',
    props: {
      device: {
        required: false,
        default () {
          return {
            type: null,
            value: {},
            array: []
          }
        }
      }
    },
    date() {
      return {}
    },
    methods: {
      handleClick(operate) {
        controlDevice(this.device.value.devId, operate)
      }
    }
  }

</script>
